<template>
  <div>
    <h3>Child</h3>
    <h5>{{msg}}</h5>
    <h6>{{childMsg}}</h6>
    <!--子组件向父组件传值 通过事件触发-->
    <button @click="passMsg">走你</button>
  </div>
</template>

<script>
import bus from '../util/bus'
export default {
    
    data() {
        return {
            childMsg: '成 ----------'
        }
    },
    props: {
        //父组件里的v-bind属性
        msg: {
            type: String,
            default: ''
        },
    },
    methods: {
        passMsg() {
            this.$emit('showMsg','i am from child')
        }
    },
    mounted () {
        //上层数据绑定 v-bind="$attrs" 会获取多级组件的属性
        console.log('attrs',this.$attrs)
        //总线接受数据
        bus.$on('msg',(val)=>{
            this.childMsg=val
        });
    },
};
</script>
<style>
</style>